<template>
	<div class="detailList">
<div>
	<span class="bei" >
		<span>{{ obj.text }}</span>
	
			<img :src="img2" alt="">
	</span>
</div>
<div>
	<span class="wang1">
		<span>4.8分</span>
		<span>1.2万条点评</span>
	</span>
	<span class="wang2">
		<img :src="img1" alt="">
		北京网红打卡榜第1名
	</span>
</div>
<div>
	<span class="jian1">明日10:00开放</span>
	<span class="jian2">02月02日-02月12日 (...</span>
	<span class="jian3">简介&nbsp;&nbsp;></span>
</div>
<div>
	<span class="shi">北京市通州区梨园镇东六环与G1京哈高速交叉口西北角</span>
	<span class="di">地图&nbsp;&nbsp;></span>
</div>
		<img :src="img" alt="">
	</div>
</template>

<script>
export default {
	data() { 
		return {
			obj:{},
			img: "https://gw.alicdn.com/imgextra/i3/O1CN01T51kQV1dihyke5ANG_!!6000000003770-0-tps-704-150.jpg",
			img1: "https://img.alicdn.com/imgextra/i1/O1CN01sqOhhP1o24kJZpujg_!!6000000005166-2-tps-66-68.png",
			img2:"https://gw.alicdn.com/imgextra/i2/O1CN01WxhuVJ1rS8ABrK7YS_!!6000000005629-2-tps-270-60.png"
		}
	},
	mounted() {
		if (this.$route.query.toMcenter) {
			this.obj = JSON.parse(this.$route.query.toMcenter)
			// console.log(this.obj);
		}
	}
}
</script>

<style scoped>
.detailList{
	height: 4.58rem;
			background-image: linear-gradient(rgba(241, 11, 61, 0.727) 0%, rgb(212, 1, 46) 100%);
			margin-top: -.39rem;
			box-sizing: border-box;
}
.detailList :nth-child(1){
margin-top: .5rem;
}
.bei :nth-child(1){
	margin-top: .2rem;
	font-size: 22px;
	color: white;
	margin-left: .2rem;
}
.bei img{
width: 1.5rem;
height: .1rem;
position: relative;
top: -0.32rem;
left: .2rem;
}
.detailList :nth-child(2) {
height: .4rem;
line-height: .4rem;
border-radius: .3rem;
margin-top: .4rem;
}
.wang1{
	background-color: white;
	display: block;
	width: 2.52rem;
	height: .4rem;
	line-height: .4rem;
margin-left: .2rem;
border-radius: .3rem;
position: relative;
top: -0.46rem;
}
.wang1 :nth-child(1){
	display: block;
width: .8rem;
background-color: rgb(235, 198, 16);
border-radius: .3rem;
text-align: center;
}
.wang1 :nth-child(2) {
	display: block;
	margin-left: 1rem;
	margin-top: -0.41rem;
}
.wang2{
	display: block;
width: 3.2rem;
height: .4rem;
	line-height: .4rem;
	border-radius: .3rem;
	background-color: white;
	margin-left: 2.9rem;
	position: relative;
	top: -1.26rem;
}
.wang2 img{
	width: .3rem;
	height: .3rem;
	margin-left: .1rem;
	position: relative;
	top: -.45rem;
} 

.detailList :nth-child(3){
display: flex;
	justify-content: space-between;
	color: white;
	font-size: 14px;
	margin-top: .3rem;
}
.jian1{
	margin-left: .2rem;
		position: relative;
			bottom: 1rem;
}
.jian2{
	margin-left: -1.2rem;
	position: relative;
	top: -.88rem;
}
.jian3{
	margin-right: .3rem;
	position: relative;
		top: -.75rem;
}
.detailList :nth-child(4) {
display: flex;
justify-content: space-between;
		color: rgb(255, 255, 255);
font-size: 14px;
margin-bottom: .45rem;
}
.shi{
	display: block;
	width: 5.7rem;
	margin-left: .2rem;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	color: white;
	position: relative;
bottom: -.37rem;
position: relative;
top: -1.2rem;
}
.di{
	margin-right: .3rem;
	position: relative;
		top: -1.1rem;
}
.detailList :nth-child(5){
	widows: 7.14rem;
	height: 1.5rem;
	border-radius: .3rem;
	margin-left: .24rem;
	position: relative;
	top: -1.15rem;
}
</style>